<template>
	<view>
		<view class="topline"></view>
		<view class="address" v-if="order.come_from!=2">
			<view class="left">收货地址</view>
			<view class="right">
				<view class="">
					<view class="">{{addressData.address}}</view>
					<view class="">{{addressData.area}}</view>
					<view class="">{{addressData.name}} {{addressData.phone}}</view>
				</view>
			</view>
		</view>
		<view class="isline"></view>
		<view class="isgoods" v-for="(item,index) in order.goods_image" :key="index">
			<image :src="$fun.imgUrl(item.image)" mode=""></image>
			<view class="isgoods_text">
				<view class="">
					<u--text :lines="2" size='14' color='#333333' :text="item.name"></u--text>
				</view>
				<!-- <view class="" style="margin-top: 10rpx;">
					<u--text :lines="2" size='12' color='#999999' text="水动力护肤补水保湿控油洁面爽肤水 100ml"></u--text>
				</view> -->
				<view class="isgoods_num">
					<view class="">￥{{item.money}}</view>
					<view class="textnum">x{{item.num}}</view>
				</view>
			</view>

		</view>
		<view class="isline"></view>
		<view class="goodsid">
			<view class="">订单编号</view>
			<view class="right">
				<view class="">{{order.order_sn}}</view>
				<image src="../../static/copy2x.png" mode="" @click="copy(order.order_sn)"></image>
			</view>
		</view>
		<view class="isline"></view>
		<view class="goodsid">
			<view class="">下单时间</view>
			<view class="right">
				<view class="">{{order.createtime}}</view>
			</view>
		</view>
		<view class="" v-if="order.express_code">
			<view class="isline"></view>
			<view class="goodsid">
				<view class="">快递单号</view>
				<view class="right">
					<view class="">{{order.express_code}}</view>
					<image src="../../static/copy2x.png" mode="" @click="copy(order.express_code)"></image>
				</view>
			</view>
		</view>

		<view class="isline"></view>
		<view class="btnpay" @click="orderPay()" v-if='order.status==0'>继续付款</view>
		<view class="btnpay" @click="configOrder()" v-if='order.status==3'>确认收货</view>
		<showpayVue ref="child" :showpaymodel="showpaymodel" :oid='oid' :from='order.come_from'
			@showpaybtn="showpaybtn"></showpayVue>
	</view>
</template>

<script>
	import showpayVue from './showpay.vue';
	export default {
		components: {
			showpayVue
		},
		data() {
			return {
				id: '',
				showpaymodel: false,
				oid: '',
				order: {},
				addressData: {}
			}
		},
		onLoad(option) {
			this.id = option.id
			uni.setNavigationBarTitle({
				title: option.stateTip
			})
			this.oid = 'HD' + option.id
			//订单详情
			this.$fun.ajax.post('user/getOrder', {
				id: this.id
			}).then(res => {
				if (res.code == 1) {
					this.order = res.data
					if (res.data.come_from != 2) {
						this.getData(this.order.address_id)
					}
				}
			})
		},
		methods: {
			showpaybtn(showpaymodel) {
				this.showpaymodel = showpaymodel
				this.zIndex = 10075
			},
			orderPay() {
				uni.showLoading({
					title: '',
				})
				setTimeout(() => {
					uni.hideLoading()
					this.showpaymodel = true
				}, 1000)
				this.$refs.child.getorder(this.oid);
			},
			copy(text) {
				uni.setClipboardData({
					data: text,
					success: () => {
						this.$fun.msg('复制成功')
					},
					fail: () => {
						this.$fun.msg('复制失败')
					},
					complete: () => {
						// this.showTooltip = false
					}
				})
			},
			//收货
			configOrder(item, index) {
				uni.showLoading({
					title: '请稍后'
				})
				this.$fun.ajax.post('order/reorder', {
					id: this.id
				}).then(res => {
					uni.hideLoading();
					if (res.code == 1) {
						this.$fun.msg(res.msg)
					}
				})
			},
			// 查询地址
			getData(id) {
				this.$fun.ajax.post('user/getaddr', {
					id
				}).then(res => {
					this.addressData = res.data
				})
			},
		}
	}
</script>

<style lang="scss">
	.topline {
		width: 750rpx;
		height: 2rpx;
		background: #EAEAEA;
	}

	.isline {
		width: 750rpx;
		height: 16rpx;
		background: #F5F1EE;
	}

	.address {
		display: flex;
		height: 156rpx;
		justify-content: space-between;
		align-items: center;
		margin: 0 30rpx;

		.left {
			font-weight: 500;
			font-size: 28rpx;
			color: #333333;
		}

		.right {
			font-weight: 400;
			font-size: 24rpx;
			color: #333333;
			display: flex;
			align-items: center;

			image {
				width: 48rpx;
				height: 48rpx;
			}
		}
	}

	.isgoods {
		display: flex;
		padding: 30rpx;

		image {
			width: 160rpx;
			height: 160rpx;
		}

		&_text {
			width: 364rpx;
			margin-left: 16rpx;
		}

		&_num {
			font-weight: 600;
			font-size: 28rpx;
			color: #ED4961;
			margin-top: 20rpx;
			// margin-left: 30rpx;
			// text-align: right;

			.textnum {
				font-weight: 400;
				font-size: 28rpx;
				color: #333333;
			}
		}
	}

	.goodsid {
		padding: 30rpx;
		display: flex;
		justify-content: space-between;
		font-weight: 500;
		font-size: 28rpx;
		color: #333333;

		image {
			width: 32rpx;
			height: 32rpx;
			margin-left: 10rpx;
		}

		.right {
			display: flex;
			align-items: center;
			font-weight: 400;
			font-size: 28rpx;
			color: #333333;
		}
	}

	.btnpay {
		width: 690rpx;
		height: 88rpx;
		background: #5990FF;
		border-radius: 44rpx;
		text-align: center;
		line-height: 88rpx;
		font-weight: 500;
		font-size: 28rpx;
		color: #FFFFFF;
		margin: 90rpx auto;
	}
</style>